import React from 'react';

interface StatCardProps {
  value: string;
  label: string;
  className?: string;
}

export function StatCard({ value, label, className = '' }: StatCardProps) {
  return (
    <div className={`backdrop-blur-[14.374px] bg-[rgba(255,255,255,0.06)] rounded-[12px] w-[300px] h-[254px] flex flex-col items-center justify-center gap-[6px] ${className}`}>
      <h2 
        className="font-['Geist'] font-semibold text-[96px] leading-[152.994px] tracking-[-1.92px] bg-gradient-to-b from-[#faf1e9] to-[#edc29c] bg-clip-text"
        style={{ WebkitTextFillColor: 'transparent' }}
      >
        {value}
      </h2>
      <p className="font-['Geist_Mono'] font-light text-[11px] tracking-[1.76px] uppercase text-[#ebdccf]">
        {label}
      </p>
    </div>
  );
}